<!DOCTYPE html>
<html>
  <body>
    <div>
      <canvas id="c1" width="400" height="400"></canvas>
      <canvas id="c2" width="400" height="400"></canvas>
    </div>
    <script type="text/javascript">
      var canv1 = document.getElementById('c1');
      var canv2 = document.getElementById('c2');
      var ctx1 = canv1.getContext('2d');
      var ctx2 = canv2.getContext('2d');
    
      ctx1.strokeStyle = '#FF0000';
      ctx1.moveTo(10, 10);
      ctx1.lineTo(390, 390);
      ctx1.stroke();
    
      function doTest()
      {
        // Save img data
        var imgData = ctx1.getImageData(0, 0, canv1.width, canv1.height);
        
        // Resize canvas - seems to cause the bug
        canv1.width  = 0;
        canv1.height = 0;
        canv1.width  = 400;
        canv1.height = 400;
        
        // Put image data from ctx1 to ctx2
        ctx2.putImageData(imgData, 0, 0);
        
        // Draw canvas2 on canvas1
        ctx1.drawImage(canv2, 0, 0);
      };

      doTest();
      doTest();
    </script>
  </body>
</html>
